<!DOCTYPE HTML>
<html>
<head>
    <title>{{$title??'保存'}} - {{$back_site_name}}</title>
    @include('innerend/common/meta')
    <style>
        #searchUserList span {
            width: 143px;
        }

        #searchUserList span:hover {
            background-color: #8fd9e0;
        }
    </style>

    <script type="text/javascript" src="/static/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" src="/static/ueditor/ueditor.all.min.js"></script>
    <script type="text/javascript" src="/static/ueditor/lang/zh-cn/zh-cn.js"></script>

    <script type="text/javascript" src="/static/innerend/plupload.full.min.js"></script>
    <script type="text/javascript">
        function get_file_fun(str){
            console.log(str);
            //实例化一个plupload上传对象
            var uploader = new plupload.Uploader({
                browse_button : str, //触发文件选择对话框的按钮，为那个元素id
                url : '/backend/deal/qiniu', //服务器端的上传页面地址
                //flash_swf_url : '/Public/static/js/Moxie.swf', //swf文件，当需要使用swf方式进行上传时需要配置该参数
                //silverlight_xap_url : '/Public/static/js/Moxie.xap', //silverlight文件，当需要使用silverlight方式进行上传时需要配置该参数
                filters: {
                    mime_types : [ //只允许上传图片和zip文件
                        { title : "图片文件", extensions : "jpg,gif,png,bmp" }
                    ],
                    max_file_size : '2000kb', //最大只能上传400kb的文件
                    prevent_duplicates : true //不允许选取重复文件
                }
            });

            //在实例对象上调用init()方法进行初始化
            uploader.init();

            //绑定各种事件，并在事件监听函数中做你想做的事
            uploader.bind('FilesAdded',function(uploader,files){
                if(uploader.files.length>1){ // 最多上传3张图
                    uploader.splice(1,999);
                }
                uploader.start();
            });
            uploader.bind('FileUploaded',function(uploader,file,responseObject){
                var ret=responseObject.response;
                ret=JSON.parse(ret);
                console.log(ret);
                $("#"+str).attr("src",ret.data);
                $("#"+str+"_image").val(ret.data);

                $("#delThumb").show();
            });
        }
    </script>
</head>
<body>
<article class="page-container">
    <form action="" method="post" class="form form-horizontal" id="form-article-add">

        {!! $formHtml !!}

        <div class="row cl">
            <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                <button class="btn btn-primary radius" type="submit"><i class="Hui-iconfont">&#xe632;</i>
                    立即提交
                </button>
            </div>
        </div>
    </form>
</article>

@include('innerend/common/footer')
<script type="text/javascript" src="/static/jquery/jquery.form.js"></script>
<script type="text/javascript" src="/static/jquery.validation/1.14.0/jquery.validate.min.js"></script>
<script type="text/javascript" src="/static/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="/static/jquery.validation/1.14.0/messages_zh.min.js"></script>
<script type="text/javascript" src="/static/icheck/jquery.icheck.min.js"></script>

<style>
    #searchUserList span {
        width: 143px;
    }

    #searchUserList span:hover {
        background-color: #8fd9e0;
    }
</style>
<style>
    #search_uid_List span {
        width: 143px;
    }
    #search_uid_List span:hover {
        background-color: #8fd9e0;
    }

    #search_cate_id_List span {
        width: 143px;
    }
    #search_cate_id_List span:hover {
        background-color: #8fd9e0;
    }

    #search_topic_id_List span {
        width: 143px;
    }
    #search_topic_id_List span:hover {
        background-color: #8fd9e0;
    }
</style>

<script language="javascript">
    //var ue;
    $(document).ready(function (e) {

        /*$('.skin-minimal input').iCheck({
            checkboxClass: 'icheckbox-blue',
            radioClass: 'iradio-blue',
            increaseArea: '10%'
        });*/

        $("#form-article-add").validate({
            rules: {
                //name: {required: true, minlength: 2, maxlength: 50,},
                //channel: {required: true, minlength: 2, maxlength: 50,},
            },
            messages: {
                //name: {required: "名称必填！", minlength: "名称最短2位字符", maxlength: "名称不超过50位字符"},
                //channel: {required: "分类必填！", minlength: "分类最短2位字符", maxlength: "分类不超过50位字符"},
            },
            onkeyup: false,
            focusCleanup: true,
            success: "valid",
            submitHandler: function (form) {
				//请求url
            	//let formUrl = "{:url('/backend/'.$controller.'/on-'.($action=='add'?'add':'edit'))}";
            	let formUrl = "{{$formUrl}}";
                $(form).ajaxSubmit({
                    type: "post",  //提交方式
                    dataType: "json", //数据类型
                    url: formUrl, //请求url
                    success: function (ret) { //提交成功的回调函数
                        if (ret.code==200) {
                            layer.msg(ret.msg, {icon: 6, time: 2000});
                            setTimeout(function () {
                                /*关闭弹出框口*/
                                // layer_close(1);

                                /*关闭弹出框口*/
                                var index = parent.layer.getFrameIndex(window.name);
                                if(index){
                                    // 关闭最外层 刷新父级
                                    parent.location.reload();
                                    parent.layer.close(index);
                                }else{
                                    window.location.href = '{{$init_url}}';
                                    console.log('跳转到：{{$init_url}}')
                                }
                            }, 2000);
                        } else {
                            layer.msg(ret.msg, {icon: 0, time: 2000});
                        }
                    }
                });
            }
        });
    });

    // 编辑器
	/*ue = UE.getEditor('content',{
		serverUrl :"{:url('/innerend/deal/qiniu')}"
	});*/


    // 删除图片
    $("#delThumb").on("click",function(){
        $("#thumb").attr("src","/static/upfile.png");
        $("#thumb_image").val("");
        $("#delThumb").hide();
    });

    // 搜索
    /*function searchUser(obj){
        var keyword=$(obj).val();
        if(keyword=="")return;
        $.ajax({
            beforeSend: function () {
                //layerIdx=layer.load();
            },
            type: "POST",
            async:false,
            dataType: "json",
            url: "{:url('/innerend/search/user')}",
            data: {
                keyword:keyword,
                r: Math.random()
            },
            error: function (XmlHttpRequest, textStatus, errorThrown) {

            },
            success: function (ret) {

                if(ret.code==200){
                    var html='';
                    for(var i=0;i<ret.data.length;i++){
                        html+='<span onclick="selectUser(this)" data-id="'+ret.data[i].id+'">'+HTMLEncode(ret.data[i].username)+'</span><br/>';
                    }
                    $("#searchUserList").html(html);
                    $("#searchUserList").show();
                }else{
                    $("#searchUserList").html('');
                    $("#searchUserList").hide();
                }
            },
            complete: function () {
                //layer.close(layerIdx);
            }
        });
    }*/

    // 搜索（第三版本）
    function searchList (url,obj,field='person_id',show_id = 'id', show_label = 'username'){
        var keyword=$(obj).val();
        if(keyword=="")return;
        $.ajax({
            beforeSend: function () {
                //layerIdx=layer.load();
            },
            type: "POST",
            async:false,
            dataType: "json",
            url: url,
            data: {
                keyword:keyword,
                r: Math.random()
            },
            error: function (XmlHttpRequest, textStatus, errorThrown) {

            },
            success: function (ret) {
                if(ret.code==200){
                    var html='';
                    for(var i=0;i<ret.data.length;i++){
                        html+='<span onclick="selectAjax(this, \''+field+'\')" data-id="'+ret.data[i][show_id]+'">'+HTMLEncode(ret.data[i][show_label])+'</span><br/>';
                    }
                    // search_field_List
                    $("#search_"+field+"_List").html(html);
                    $("#search_"+field+"_List").show();
                }else{
                    $("#search_"+field+"_List").html('');
                    $("#search_"+field+"_List").hide();
                }
            },
            complete: function () {
                //layer.close(layerIdx);
            }
        });
    }

    // 搜索
    function searchUser(obj,field='uid'){
        var keyword=$(obj).val();
        if(keyword=="")return;
        $.ajax({
            beforeSend: function () {
                //layerIdx=layer.load();
            },
            type: "POST",
            async:false,
            dataType: "json",
            url: "{{url('/innerend/search/user')}}",
            data: {
                keyword:keyword,
                r: Math.random()
            },
            error: function (XmlHttpRequest, textStatus, errorThrown) {

            },
            success: function (ret) {

                if(ret.code==200){
                    var html='';
                    for(var i=0;i<ret.data.length;i++){
                        html+='<span onclick="selectAjax(this, \''+field+'\')" data-id="'+ret.data[i].id+'">'+HTMLEncode(ret.data[i].username)+'</span><br/>';
                    }
                    // search_field_List
                    $("#search_"+field+"_List").html(html);
                    $("#search_"+field+"_List").show();
                }else{
                    $("#search_"+field+"_List").html('');
                    $("#search_"+field+"_List").hide();
                }
            },
            complete: function () {
                //layer.close(layerIdx);
            }
        });
    }
    // 搜索
    function searchCate(obj, field='cate_id'){
        var keyword=$(obj).val();
        if(keyword=="")return;
        $.ajax({
            beforeSend: function () {
                //layerIdx=layer.load();
            },
            type: "POST",
            async:false,
            dataType: "json",
            url: "{:url('/innerend/search/cate')}",
            data: {
                keyword:keyword,
                r: Math.random()
            },
            error: function (XmlHttpRequest, textStatus, errorThrown) {

            },
            success: function (ret) {
                if(ret.code==200){
                    var html='';
                    for(var i=0;i<ret.data.length;i++){
                        html+='<span onclick="selectAjax(this, \''+field+'\')" data-id="'+ret.data[i].id+'">'+HTMLEncode(ret.data[i].title)+'</span><br/>';
                    }
                    $("#search_"+field+"_List").html(html);
                    $("#search_"+field+"_List").show();
                }else{
                    $("#search_"+field+"_List").html('');
                    $("#search_"+field+"_List").hide();
                }
            },
            complete: function () {
                //layer.close(layerIdx);
            }
        });
    }
    // 搜索
    function searchTopic(obj, field='topic_id'){
        var keyword=$(obj).val();
        if(keyword=="")return;
        $.ajax({
            beforeSend: function () {
                //layerIdx=layer.load();
            },
            type: "POST",
            async:false,
            dataType: "json",
            url: "{{url('/innerend/search/topic')}}",
            data: {
                keyword:keyword,
                r: Math.random()
            },
            error: function (XmlHttpRequest, textStatus, errorThrown) {

            },
            success: function (ret) {
                if(ret.code==200){
                    var html='';
                    for(var i=0;i<ret.data.length;i++){
                        html+='<span onclick="selectAjax(this, \''+field+'\')" data-id="'+ret.data[i].id+'">'+HTMLEncode(ret.data[i].title)+'</span><br/>';
                    }
                    $("#search_"+field+"_List").html(html);
                    $("#search_"+field+"_List").show();
                }else{
                    $("#search_"+field+"_List").html('');
                    $("#search_"+field+"_List").hide();
                }
            },
            complete: function () {
                //layer.close(layerIdx);
            }
        });
    }
    // 搜索的展示
    function selectAjax(obj, field){
        var fieldID=$(obj).attr('data-id');
        var fieldName=$(obj).text();
        //$("#sUser").val(userName);
        // hide_field_ID
        // show_field_ID
        console.log(obj)
        console.log(fieldID)
        console.log(fieldName)

        // 如果是单选择
        $("#hide_"+field+"_ID").val(fieldID);
        $("#show_"+field+"_ID").html(field+"："+fieldID);

        // 如果是多选
        var id_field_array=$("#"+field+"").val();
        if(id_field_array){
            let has = (id_field_array.indexOf(fieldID) > -1)
            if(!has){
                var html = '<span class="spanList" data-id="'+fieldID+'">'+fieldName+'&nbsp;<a href="javascript:;" onclick="searchRemove(this,\''+field+'\')"> 删</a></span>&nbsp;&nbsp;';
                $("#show_"+field+"_list").append(html);
                searchSelect(field);
            }
        }


        $("#search_"+field+"_List").html('');
        $("#search_"+field+"_List").hide();
    }
    // 搜索选择的内容
    function searchSelect(field){
        var id_field_array=[];
        $("#search_"+field+"_List").parent().find(".spanList").each(function(){
            id_field_array.push($(this).attr('data-id'));
        })
        console.log(field,id_field_array)
        $("#"+field+"").val(JSON.stringify(id_field_array));
    }
    // 搜索选择的内容的删除
    function searchRemove(obj,field){
        $(obj).parent().remove();
        searchSelect(field);
    }



    function HTMLEncode(html) {
        var temp = document.createElement("div");
        (temp.textContent != null) ? (temp.textContent = html) : (temp.innerText = html);
        var output = temp.innerHTML;
        temp = null;
        return output;
    }
    /*function selectUser(obj){
        var userID=$(obj).attr('data-id');
        var userName=$(obj).text();
        $("#hideuidID").val(userID);
        $("#showUserID").html("UID："+userID);
        $("#sUser").val(userName);

        $("#searchUserList").html('');
        $("#searchUserList").hide();
    }*/

</script>
</body>
</html>
